import React, { useState, useEffect } from 'react'
import { Form, Modal, Select, message } from 'antd'
import {
  changeOrderAuditor,
  getBackstageUserByShopId
} from '@/services/message'

const { Option } = Select

const SendOrder = props => {
  const { getFieldDecorator } = props.form
  //   const [isSend, showSend] = useState(false)

  const [list, setList] = useState([])

  const loadAuditorList = async () => {
    const { data } = await getBackstageUserByShopId({
      shopId: localStorage.getItem('shopId')
    })
    setList(data)
  }

  // orderId backstageUserId
  const onOk = () => {
    props.form.validateFields(async (error, { backstageUserId }) => {
      if (!error) {
        const res = await changeOrderAuditor({
          orderId: props.orderId,
          backstageUserId
        })
        if (res.responseType === 'SUCCESS') {
          message.success('指派审核人成功')
          props.closeSendOrder()
        }
      }
    })
  }

  useEffect(() => {
    loadAuditorList()
  }, [])

  return (
    <>
      <Modal
        title="派单操作"
        visible={props.isShow}
        destroyOnClose
        onCancel={props.closeSendOrder}
        onOk={onOk}
      >
        <Form>
          <Form.Item label="请选择审核人：">
            {getFieldDecorator('backstageUserId', {
              rules: [{ required: true, message: '请选择审核人' }]
            })(
              <Select
                style={{ width: 120 }}
                placeholder="请选择"
                // onChange={handleChange}
              >
                {list &&
                  list.map(item => (
                    <Option key={item.id} value={item.id}>
                      {item.name}
                    </Option>
                  ))}
              </Select>
            )}
          </Form.Item>
        </Form>
      </Modal>
    </>
  )
}

export default Form.create()(SendOrder)
